<template>
    <div>
        <el-form-item>
            <template #label>
                <el-checkbox v-model="self0ptions.options.hasUpload">允许上传附件</el-checkbox>
            </template>
            <div style="text-align: right" class="cursor-pointer font-color-main" v-if="self0ptions.options.hasUpload"
                 @click="openSetting">
                设置
            </div>
        </el-form-item>
        <el-dialog
            title="附件上传设置"
            :visible.sync="dialogVisible"
            width="30%"
            :append-to-body="true"
        >
            <el-form label-position="top" label-width="80px" :model="self0ptions.options.uploadConfig">
                <el-form-item label="上传按钮显示设置">
                    <el-radio-group v-model="self0ptions.options.uploadConfig.hasUploadBtn">
                        <el-radio label="一直显示">一直显示</el-radio>
                        <el-radio label="满足场景时显示（否则隐藏）">满足场景时显示（否则隐藏）</el-radio>
                    </el-radio-group>

                    <div v-if="self0ptions.options.uploadConfig.hasUploadBtn == '满足场景时显示（否则隐藏）'"
                         class="bg-show-cont">
                        <div class="tip-title">上传按钮显示得场景</div>
                        <el-checkbox-group v-model="self0ptions.options.uploadConfig.hasUploadBtnSet">
                            <el-checkbox label="不得满分时显示"></el-checkbox>
                            <el-checkbox label="得满分时显示"></el-checkbox>
                            <el-checkbox label="不适用时显示"></el-checkbox>
                        </el-checkbox-group>
                    </div>
                </el-form-item>
                <el-form-item label="是否必传">
                    <el-radio-group v-model="self0ptions.options.uploadConfig.isRequiredUpload">
                        <el-radio label="附件可不传">附件可不传</el-radio>
                        <el-radio label="至少">至少上传<el-input style="width: 80px" v-model="self0ptions.options.uploadConfig.numInput"
                        :disabled="self0ptions.options.uploadConfig.isRequiredUpload != '至少'"></el-input>个附件</el-radio>
                        <el-radio label="满足场景时必传">满足场景时必传</el-radio>
                    </el-radio-group>

                    <div v-if="self0ptions.options.uploadConfig.isRequired == '满足场景时必传'"
                         class="bg-show-cont">
                        <div class="tip-title">附件必传的场景</div>
                        <el-checkbox-group v-model="self0ptions.options.uploadConfig.isRequiredUploadSet">
                            <el-checkbox label="不得满分时附件必传"></el-checkbox>
                            <el-checkbox label="得满分时附件必传"></el-checkbox>
                            <el-checkbox label="不适用时附件必传"></el-checkbox>
                        </el-checkbox-group>
                    </div>
                </el-form-item>
                <el-form-item label="文件上传大小限制">
                    <div style="display: flex;align-items: center">
                        <el-input v-model="self0ptions.options.uploadConfig.isMaxFileSize"></el-input>
                        <div style="font-size: 12px;color: #4d4d4d;width: 20px;margin-left: 5px">MB</div>
                    </div>
                </el-form-item>
                <el-form-item label="文件格式限制">
                    <el-radio-group v-model="self0ptions.options.uploadConfig.fileGeshi">
                        <el-radio label="不限制文件格式">不限制文件格式</el-radio>
                        <el-radio label="限制文件格式">限制文件格式</el-radio>
                    </el-radio-group>

                    <div v-if="self0ptions.options.uploadConfig.fileGeshi == '限制文件格式'"
                         class="bg-show-cont">
                        <div class="tip-title">可上传文件格式</div>
                        <el-checkbox-group v-model="self0ptions.options.uploadConfig.fileGeshiSet">
                            <el-checkbox label="图片"></el-checkbox>
                            <el-checkbox label="视频"></el-checkbox>
                            <el-checkbox label="音频"></el-checkbox>
                            <el-checkbox label="办公文档(Word,Excel,PPTPDF)"></el-checkbox>
                            <el-checkbox label="压缩文件"></el-checkbox>
                        </el-checkbox-group>
                    </div>
                </el-form-item>
                <el-form-item label="上传设备限制">
                    <el-radio-group v-model="self0ptions.options.uploadConfig.disShebei">
                        <el-radio label="PC端和手机端都可上传">PC端和手机端都可上传</el-radio>
                        <el-radio label="仅手机端可上传">仅手机端可上传</el-radio>
                        <el-radio label="仅PC端可上传">仅PC端可上传</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="手机端上传设置">
                    <el-checkbox-group v-model="self0ptions.options.uploadConfig.shoujiUploadSet">
                        <el-checkbox label="可相机拍照" :disabled="self0ptions.options.uploadConfig.disShebei == '仅PC端可上传'"></el-checkbox>
                        <el-checkbox label="可拍视频" disabled></el-checkbox>
                        <el-checkbox label="可录音" disabled></el-checkbox>
                        <el-checkbox label="可上传手机文件" :disabled="self0ptions.options.uploadConfig.disShebei == '仅PC端可上传'"></el-checkbox>
                    </el-checkbox-group>
                </el-form-item>
            </el-form>
            <el-form label-position="left" label-width="100px" :model="self0ptions.options.remarkConfig"
            v-if="self0ptions.options.hasOwnProperty('remarkConfig')">
                <el-form-item label="备注框高度">
                    <el-select v-model="self0ptions.options.remarkConfig.remHeight">
                        <el-option v-for="item in (1,10)" :key="item" :label="`${item}行`" :value="`${item}行`"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
        </el-dialog>
    </div>
</template>
<script>
export default {
    name: "hasUpload-editor",
    props: {
        self0ptions: {
            type: Object,
        }
    },
    data() {
        return {
            dialogVisible: false
        }
    },
    methods: {
        openSetting() {
            this.dialogVisible = true
        }
    }
}
</script>
<style scoped lang="scss">

</style>
